<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>角色管理</title>
<#assign base=request.contextPath  />
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="${base}/js/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="${base}/css/demo.css" type="text/css">
    <link rel="stylesheet" href="${base}/css/zTreeStyle.css" type="text/css">
    <script type="text/javascript" src="${base}/js/ztree/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="${base}/js/ztree/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="${base}/js/zhang.js"></script>
    <script type="text/javascript" src="${base}/js/ztree/jquery.ztree.excheck.js"></script>
    <script type="text/javascript" src="${base}/js/ztree/jquery.ztree.exedit.js"></script>
    <script type="text/javascript" src="${base}/js/zhang.js"></script>
    <style type="text/css">
      form{
          		padding: 20px;
          	}
          	.layui-btn-radius{
            			border-radius: 5px;
            		}
      </style>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
  <legend>角色管理</legend>
</fieldset>
	<div class="demoTable"style="padding:15px;">
	        <button class="layui-btn layui-btn-radius" id="btn2" data-method="offset" type="button" style="background-color: #0092EF;">添加角色</button>
          <div style="float:right">
          <div class="layui-inline">
        	    <input class="layui-input" name="id" id="demoReload" autocomplete="off">
          </div>
        <button class="layui-btn layui-btn-radius" id="btn1" data-type="reload" style="background-color: #0092EF;">搜索</button>

    </div>
    </div>
			<table class="layui-hide"  id="test"></table>
<script type="text/html" id="barDemo">
  <i class="layui-icon layui-icon-delete layui-btn-xs" lay-event="del"  href="javascript:void(0)"  onclick="delectRole('{{d.id}}')"  style="font-size: 20px;" ></i>
</script>
<script src="${base}/js/layui/layui.js"></script>
<script>
layui.use(['form', 'layedit', 'laydate','table'], function(){
  var form = layui.form
  ,$ = layui.jquery
  ,layer = layui.layer
  ,layedit = layui.layedit
  ,laydate = layui.laydate
  ,table = layui.table;
  table.render({
    elem: '#test'
    ,url:'${base}/role/findRole'//数据接口
    ,height:500
    ,cols: [[
      {field:'username',templet:function(val){
          return val.LAY_INDEX
      }, align: 'center',width:80, title: ''}
      ,{field:'roleName',align: 'center', title: '角色',width:300,}
      ,{field:'createTime', align: 'center',templet:function(val){
              return changeDateFormat(val.createTime)
          }, title: '创建时间',width:400,}

      ,{field: 'right',align: 'center', title:'操作', toolbar: '#barDemo', width: 200}


    ]]
    ,id:'testReload'
    ,page: {
           layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
           ,theme: '#0092EF'
           ,limit:20
         }  ,done: function(res, curr, count){
          this.where={};
      }
  });
    $('#btn1').on('click', function(){
        var whereData={};
            whereData.roleName=Trim($("#demoReload").val())
        var table = layui.table;
        //表刷新方法
        table.reload('testReload', {
            url: '${base}/role/findRole'
            ,where: whereData
        });

    });
  var active = {
    	offset: function(othis){
    	  var type = othis.data('type')
    	  ,text = othis.text();
		  layer.open({
		  type: 2,
		  title: '添加角色',

		  shadeClose:false ,
		  area:['560px','560px'],
		  content: '${base}/role/Role_add',
		  success: function (layero, index) {
                var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
           }
		});
	}
  };
   $('#btn2').on('click', function(){
    var othis = $(this), method = othis.data('method');
    active[method] ? active[method].call(this, othis) : '';
  });
});

function delectRole(id){

layer.confirm('真的要删除吗?', function(index){
 $.ajax({
    type:"POST",
       url:"${base}/role/deleteRole",
       data:{"id":id},
           success : function(data){
                layer.msg(data)
           var table = layui.table;
            //表刷新方法
              table.reload('testReload', {
                   url: '${base}/role/findRole'
                      ,where: {} //设定异步数据接口的额外参数
                                  });
                                    layer.close(index);
                       }
                 });

} );
            }
</script>
</script>
</body>
</html>